import { observable, action, computed, runInAction } from 'mobx'
import { post } from 'lib/net'
import CommonVM from 'cvm/common'
import * as api from 'lib/constants/api'
import Global from 'cvm/common/global'
import wechat from 'lib/utils/wechat'

class ReplyVM {
  constructor (props) {
    this.data = props.data
  }

  // 回复内容
  @observable data = null

  // 点赞图标
  @computed get likeIcon () {
    return this.data && this.data.CanPoint === 0
        ? require('images/thumbs-select.png')
        : require('images/thumbs.png')
  }

  // 点赞
  @action handleLike = async () => {
    let userInfo = Global.userInfo()
    if (this.data.CanPoint === 0 || !userInfo.userId) return
    let params = {PostID: this.postId, UserInfoID: userInfo.userId}
    this.data.PointNumber += 1
    this.data.CanPoint = 0
    post(api.ADD_POINT, params)
  }
}

export default class MainTextVM extends CommonVM {
  constructor (props) {
    super()
    this.props = props
    let search = this.props.location.search
    this.postId = search.substr(1, 36)
    this.addWatchs()
    this.fetchPostDetail()
    this.fetchPostDetailReply()
  }

  // 详情
  @observable data = null
  // 回复
  @observable replys = []
  // 收藏cover是否显示
  @observable collectVisible = false
  // 是否显示分享
  @observable showShare = 'none'
  // 显示二维码
  @observable showQrcode = 'none'
  // 评论框是否显示
  @observable dialogVisible = false
  // 评论内容
  @observable commentValue = ''
  // 回复占位符
  @observable placeholder = '输入回复内容'
  // 回复id
  @observable replyItem = null

  // 收藏类型
  @computed get collectType () {
    return this.data && this.data.CanCollect === 0 ? '取消收藏' : '收藏'
  }
  // 是否关注
  @computed get isAttention () {
    return this.userId ? '已关注' : '关注'
  }
  // 点赞图标
  @computed get likeIcon () {
    return this.data && this.data.CanPoint === 0
    ? require('images/thumbs-select.png')
    : require('images/thumbs.png')
  }

  wxShareConfig = () => {
    let params = {
      appMessage: {
        title: '种植秀',
        link: api.WX_MAINTEXT_SHARE + this.data.ID,
        desc: this.data.NoticeContent,
        postId: this.data.ID,
        userId: this.userId
      },
      timeline: {
        title: this.data.NoticeContent,
        link: api.WX_MAINTEXT_SHARE + this.data.ID,
        postId: this.data.ID,
        userId: this.userId
      }
    }
    wechat.wxShareConfig(params)
  }

  // 帖子详情
  @action fetchPostDetail = async () => {
    let params = {ID: this.postId}
    if (this.userId) {
      params.UserInfoID = this.userId
    }
    let res = await post(api.GET_POST_DETAIL, params)
    if (res.state === 1) {
      this.data = res.data
      this.wxShareConfig()
    } else {
      console.log('获取失败')
    }
  }

  // 帖子回复详情
  @action fetchPostDetailReply = async () => {
    this.fetchPage()
    let params = {
      PostID: this.postId,
      Offset: this.pageInfo.page,
      Limit: this.pageInfo.size,
      TimeStamp: this.pageInfo.timeStamp
    }
    if (this.userId) {
      params.UserInfoID = this.userId
    }
    let res = await post(api.POST_DETAIL_REPLY, params)
    if (res.state === 1) {
      runInAction(() => {
        if (res.data) {
          let data = res.data.Replys.map(item => {
            return new ReplyVM({data: item})
          })
          if (this.pageInfo.page === 1) {
            this.replys.splice(0, this.replys.length, ...data)
          } else {
            this.replys.splice(this.replys.length, 0, ...data)
          }
        }
        this.receivePage(res.data.Replys)
      })
    } else {
      this.receivePage(null)
    }
  }

  // 查看更多评论
  @action handleLoadMore = () => {
    this.fetchPostDetailReply(this.postId)
  }

  // 增加阅读数
  @action addWatchs = () => {
    post(api.ADD_WATCHS, {id: this.postId})
  }

  // 显示评论框
  @action handleShowModal = (item) => {
    this.dialogVisible = true
    if (item.data) {
      this.replyItem = item.data
      this.placeholder = '@' + item.data.Answer
    } else {
      this.replyItem = null
      this.placeholder = '输入回复'
    }
  }

  // 确定
  @action handleOk = async () => {
    if (this.commentValue.length === 0) return
    if (this.commentValue.length > 300) {
      console.log('字数超出')
    }
    let params = {
      PostID: this.postId,
      UserInfoID: this.userId,
      Content: this.commentValue
    }
    if (this.replyItem) {
      params.PID = this.replyItem.ID
    }
    this.hideModal()
    let res = await post(api.REPLY, params)
    if (res.state === 1) {
      runInAction(() => {
        this.pageInfo.page = 1
        this.data.CommentriosNumber = res.data.CommentriosNumber
        this.fetchPostDetailReply(this.data.ID)
      })
    }
  }

  // 隐藏
  @action hideModal = () => {
    this.placeholder = ''
    this.replyItem = null
    this.commentValue = ''
    this.dialogVisible = false
  }

  // 取消
  @action handleCancel = () => {
    this.hideModal()
  }

  // 修改文本内容
  @action handleChangeComment = (e) => {
    this.commentValue = e.target.value
  }

  // 分享界面返回首页
  @action handleShareToHome = () => {
    if (this.userId) {
      this.props.history.replace('/')
    } else {
      window.location.href = 'http://green.shundaonetwork.com/oauth/wx_login'
    }
  }

  // 点击关注
  @action handleAttention = () => {
    if (this.userId) return
    this.handleShowShare()
  }

  // 分享配置
  @action handleHideShare = () => {
    if (this.userId) {
      this.showShare = 'none'
    } else {
      this.showQrcode = 'none'
    }
  }

  @action handleShowShare = () => {
    if (this.userId) {
      this.showShare = 'block'
    } else {
      this.showQrcode = 'block'
    }
  }

  // 查看更多
  @action handleMore = () => {
    this.collectVisible = true
  }

  // 点赞
  @action handleLike = async () => {
    if (this.data.CanPoint === 0 || !this.userId) return
    let params = {PostID: this.postId, UserInfoID: this.userId}
    this.data.PointNumber += 1
    this.data.CanPoint = 0
    await post(api.ADD_POINT, params)
  }

  // 收藏帖子
  @action collect = async () => {
    let params = { PostID: this.postId, UserInfoID: this.userId }
    let url = ''
    let msg = ''
    if (this.data.CanCollect === 1) {
      url = api.COLLECT_POST
      this.data.CanCollect = 0
      msg = '收藏成功'
    } else {
      url = api.DELETE_COLLECT
      this.data.CanCollect = 1
      msg = '取消收藏成功'
    }
    this.handleHideCover()
    let res = await post(url, params)
    if (res.state === 1) {
      console.log(msg)
    }
  }

  // 隐藏收藏页面
  @action handleHideCover = () => {
    this.collectVisible = false
  }
}
